import type { TagThemeVarBaseConfig, TagThemeVarConfig } from './types'
import { ThemeElement, ThemeProperty, ThemeState } from '../../types'
import { BaseThemeVarService } from '../base'

export class TagThemeVarService extends BaseThemeVarService {
  private static instance: TagThemeVarService

  static getInstance(): TagThemeVarService {
    if (!TagThemeVarService.instance) {
      TagThemeVarService.instance = new TagThemeVarService()
    }
    return TagThemeVarService.instance
  }

  get default(): TagThemeVarConfig {
    return {
      blue: this.blue,
    }
  }

  get blue(): TagThemeVarBaseConfig {
    return {
      text: this.varMapper.getVarName(
        {
          element: ThemeElement.Tag,
          subElement: 'blue',
          property: ThemeProperty.Text,
        },
      ),
      textHover: this.varMapper.getVarName(
        {
          element: ThemeElement.Tag,
          subElement: 'blue',
          property: ThemeProperty.Text,
          state: ThemeState.Hover,
        },
      ),
      bg: this.varMapper.getVarName(
        {
          element: ThemeElement.Tag,
          subElement: 'blue',
          property: ThemeProperty.Bg,
        },
      ),
      bgHover: this.varMapper.getVarName(
        {
          element: ThemeElement.Tag,
          subElement: 'blue',
          property: ThemeProperty.Bg,
          state: ThemeState.Hover,
        },
      ),
    }
  }
}
